<template>
    <div class="invite-top fcc" :style="bgimg">
        <span class="title" v-text="invite_banner[0]" />
        <span class="invite_text" v-text="invite_banner[1]" />
        <hb-button class="btn-signin"
            v-if="!signed"
            :txt="invite_banner[2]"
            @clk="e_page('signin')"
        />
    </div>
</template>

<script>
import Lang from "./lang.js"
import {bg} from "@d/qsoft"
import imgBg from "./banner.jpg"
export default {
    data() {
        return {
            bg,
        }
    },
    computed: {
		lang() {
			return this.$store.state.setting.lang;
		},
		invite_banner() {
			let lang = this.lang;
			return Lang.invite_banner[lang];
        },
        bgimg() {
            return `background: url("${imgBg}") no-repeat;`
        },
        signed() {
            return this.$store.state.user.signed
        }
	},
    created() {

    },
    methods: {
		e_page(s) {
			this.$router.push(`/${s}`);
		}
	}
}
</script>

<style scoped>
.invite-top {
	height: 650px;
	flex-direction: column;
}
.title {
	font-size: 45px;
	color: #cad3ff;
}
.invite_text {
	margin: 60px 0;
	font-size: 30px;
	color: #cad3ff;
}
</style>